//This function is used to modal
$(document).ready(function() {	

	$('a[name=modal]').click(function(e) {
		e.preventDefault();
		
		var id = $(this).attr('href');
	
		var maskHeight = $(document).height();
		var maskWidth = $(window).width();
	
		$('#mask').css({'width':maskWidth,'height':maskHeight});

		$('#mask').fadeIn(1000);	
		$('#mask').fadeTo("slow",0.8);	
	
		//Get the window height and width
		var winH = $(window).height();
		var winW = $(window).width();
              
		$(id).css('top',  winH/2-$(id).height()/2);
		$(id).css('left', winW/2-$(id).width()/2);
	
		$(id).fadeIn(2000); 
	
	});
	
	$('.window .close').click(function (e) {
		e.preventDefault();
		
		$('#mask').hide();
		$('.window').hide();
	});		
	
	$('#mask').click(function () {
		$(this).hide();
		$('.window').hide();
	});			
	
});

//This method will validate and save the player
$(document).ready(function(){
	
	$('#submitPlayer').submit(function (e){
		  var playerS = $(this).serialize();
		  var selectedPosition = $("#selectPosition option:selected").text();
		  
		  playerS = playerS + "&position.positionDescription="+selectedPosition;
		  
	      $.post('/jowey/player/save',playerS, function(playerParsed) {
	    	  //var playerParsed = JSON.parse(player);
	    	  
	    	  $('#mask').hide();
	    	  $('.window').hide();
	    	  
	    	  var table = $('#playerTable');
	    	  var  line		     = document.createElement("tr");
              var tdRegistration = document.createElement("td");
          	  var tdName 		 = document.createElement("td");
          	  var tdPosition     = document.createElement("td");
          	  var tdPhone	     = document.createElement("td");
          	  var tdEmail        = document.createElement("td");
          	  var tdAction       = document.createElement("td");
          	  
          	  tdRegistration.innerHTML = playerParsed.registration;
          	  tdName.innerHTML 		   = playerParsed.name;
          	  tdPosition.innerHTML     = playerParsed.position.positionDescription;
          	  tdPhone.innerHTML		   = playerParsed.phone;
          	  tdEmail.innerHTML		   = playerParsed.email;
          	  tdAction.innerHTML       = "<img src='../resources/css/images/lapis.png'/><img src='../resources/css/images/close.png'/>";
        	
          	  line.appendChild(tdRegistration);
           	  line.appendChild(tdName);
          	  line.appendChild(tdPosition);
          	  line.appendChild(tdPhone);
          	  line.appendChild(tdEmail);
          	  line.appendChild(tdAction);
          	  
          	   table.append(line);
          	  
	      });
	      
	      e.preventDefault();
	      clearInputs();
	      
	});
});

//This method will do the request to server to get the players who is already in the DB
$(document).ready(function () {
    $.ajax({
        type:'GET',
        url:"/jowey/player/getPlayers",
        dataType:'json',
        success:function (result) {
        	
        	var table = $('#playerTable');
        	//var table = $('#dados');
        	
        	var line;
        	var tdRegistration;
        	var tdName; 		   
        	var tdPosition;   
        	var tdPhone;
        	var tdEmail;
        	var tdAction;
        	
        	var buttonEdit;
        	var buttonDelete;
        	
        	for(var i = 0;i<result.length;i++){
  
        		line		   = document.createElement("tr");
        		
                tdRegistration = document.createElement("td");
                tdRegistration.setAttribute("id","btn_"+result[i].registration);
                
            	tdName 		   = document.createElement("td");
            	tdName.setAttribute("id","name_"+result[i].registration);
            	
            	tdPosition     = document.createElement("td");
            	tdPosition.setAttribute("id","position_"+result[i].registration);
            	
            	tdPhone	       = document.createElement("td");
            	tdPhone.setAttribute("id","phone_"+result[i].registration);
            	
            	tdEmail        = document.createElement("td");
            	tdEmail.setAttribute("id","email_"+result[i].registration);
            	
            	tdAction       = document.createElement("td");
            	
            	buttonEdit = "<a href=\"#\" name=\"modal\" id="+result[i].registration +" onclick=getId(this);>EDIT</a>";
            	
            	tdRegistration.innerHTML = result[i].registration;
            	tdName.innerHTML 		 = result[i].name;
            	tdPosition.innerHTML     = result[i].position.positionDescription;
            	tdPhone.innerHTML		 = result[i].phone;
            	tdEmail.innerHTML		 = result[i].email;	
            	//tdAction.innerHTML       = "img src='../resources/css/images/lapis.png'&nbsp;&nbsp;&nbsp;&nbsp;<a href='#'><img src='../resources/css/images/close.png'/></a>";
            	tdAction.innerHTML = buttonEdit;
            	
            	line.appendChild(tdRegistration);
            	line.appendChild(tdName);
            	line.appendChild(tdPosition);
            	line.appendChild(tdPhone);
            	line.appendChild(tdEmail);
            	line.appendChild(tdAction);
            	
            	table.append(line);
            
        	}
        },
        error:function (jqXHR, textStatus, errorThrown) {
            alert("player " + textStatus + " " + errorThrown + " !");
        }
    });
});

function clearInputs() {
    $('input[id*="input"]').each(function () {
        $(this).val('');
    });
}

function getId(btn){
		var idTx = null;
		var tx = null;
		
		idTx = "#name_"+btn.id;
		tx = $(idTx).text();
		$('#inputName').val(tx); 
		
		idTx = "#phone_"+btn.id;
		tx = $(idTx).text();
		$('#inputPhone').val(tx);
		
		idTx = "#email_"+btn.id;
		tx = $(idTx).text();
		$('#inputEmail').val(tx);
		
		$('#mask').show();
        $('.window').show();
};
